<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title>订单服务</title>
		<link rel="stylesheet" type="text/css" href="css/orderServer.css" />
		<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
		<script type="text/javascript">
			document.addEventListener('plusready', function() {
				//console.log("所有plus api都应该在此事件发生后调用，否则会出现plus is undefined。"

			});

			function divshow() {
				document.getElementById("btnshow").style.display = "block";
				document.getElementById("btnhref").innerHTML = "收起";
				document.getElementById("btnhref").href = "javascript:divHidden()";
			}

			function divHidden() {
				document.getElementById("btnshow").style.display = "none";
				document.getElementById("btnhref").innerHTML = "查看更多";
				document.getElementById("btnhref").href = "javascript:divshow()";
			}
		</script>
	</head>

	<body>
		<div class="page">
			<!--顶部内容start -->
			<header class="header">
				<p></p>
				<p id="title">订单</p>
				<img id="tips" src="Order-font/xiaoxi.svg" />
			</header>
			<!--顶部内容end -->
			<section class="content">
				<!--导航内容start -->
				<nav class="nav-order">
					<div class="nav-title">
						<div class="nav-head">
							<b>火车票订单</b>
						</div>
						<div class="nav-tips">
							<a href="#">温馨提示</a>
						</div>
					</div>
					<hr color="#f1f3f2" />
					<div class="nav-icon">
						<div class="icon-tips">
							<img src="Order-font/pay.svg" />
							<p>待支付</p>
						</div>
						<div class="icon-tips">
							<img src="Order-font/paiedsvg.svg" />
							<p>已支付</p>
						</div>
						<div class="icon-tips">
							<img src="Order-font/order.svg" />
							<p>候补订单</p>
						</div>
						<div class="icon-tips">
							<img src="Order-font/person.svg" />
							<p>本人车票</p>
						</div>
					</div>
					<div class="">
						<hr style="border: 1rem solid #f1f3f2;" />
					</div>
				</nav>
				<!--导航内容end -->

				<!--中间列表内容start -->
				<section class="section">
					<div class="show-list">
						<div class="section-list">
							<div class="list-left">
								<div class="list-left-tips1">
									<img src="Order-font/food.svg" />
								</div>
							</div>
							<div class="list-right">
								<p>餐饮·特产订单</p>
							</div>
						</div>
						<div class="list-hr">
							<div></div>
							<div class="hr-right">
								<hr color="#f1f3f2" />
							</div>
						</div>
						<div class="section-list">
							<div class="list-left">
								<div class="list-left-tips2">
									<img src="Order-font/insure.svg" />
								</div>
							</div>
							<div class="list-right">
								<p>保险订单</p>
							</div>
						</div>
						<div class="list-hr">
							<div></div>
							<div class="hr-right">
								<hr color="#f1f3f2" />
							</div>
						</div>
						<div class="section-list">
							<div class="list-left">
								<div class="list-left-tips3">
									<img src="Order-font/hotel.svg" />
								</div>
							</div>
							<div class="list-right">
								<p>酒店订单</p>
							</div>
						</div>
						<div class="list-hr">
							<div></div>
							<div class="hr-right">
								<hr color="#f1f3f2" />
							</div>
						</div>
						<div class="section-list">
							<div class="list-left">
								<div class="list-left-tips4">
									<img src="Order-font/airplane.svg" />
								</div>
							</div>
							<div class="list-right">
								<p>空铁联运订单</p>
							</div>
						</div>
						<div class="list-hr">
							<div></div>
							<div class="hr-right">
								<hr color="#f1f3f2" />
							</div>
						</div>
						<div class="section-list">
							<div class="list-left">
								<div class="list-left-tips5">
									<img src="Order-font/term-bill.svg" />
								</div>
							</div>
							<div class="list-right">
								<p>计次·定期票订单</p>
							</div>
						</div>
						<div class="list-hr">
							<div></div>
							<div class="hr-right">
								<hr color="#f1f3f2" />
							</div>
						</div>
						<div class="section-list">
							<div class="list-left">
								<div class="list-left-tips6">
									<img src="Order-font/car.svg" />
								</div>
							</div>
							<div class="list-right">
								<p>约车订单</p>
							</div>
						</div>
						<div class="list-hr">
							<div></div>
							<div class="hr-right">
								<hr color="#f1f3f2" />
							</div>
						</div>
						<div class="btnshow-list" id="btnshow" style="display: none;">
							<div class="section-list">
								<div class="list-left">
									<div class="list-left-tips7">
										<img src="Order-font/love.svg" />
									</div>
								</div>
								<div class="list-right">
									<p>出站引导服务订单</p>
								</div>
							</div>
							<div class="list-hr">
								<div></div>
								<div class="hr-right">
									<hr color="#f1f3f2" />
								</div>
							</div>
							<div class="section-list">
								<div class="list-left">
									<div class="list-left-tips8">
										<img src="Order-font/shopping-car.svg" />
									</div>
								</div>
								<div class="list-right">
									<p>铁路商场订单</p>
								</div>
							</div>
							<div class="list-hr">
								<div></div>
								<div class="hr-right">
									<hr color="#f1f3f2" />
								</div>
							</div>
							<div class="section-list">
								<div class="list-left">
									<div class="list-left-tips9">
										<img src="Order-font/bus.svg" />
									</div>
								</div>
								<div class="list-right">
									<p>汽车票订单</p>
								</div>
							</div>
							<div class="list-hr">
								<div></div>
								<div class="hr-right">
									<hr color="#f1f3f2" />
								</div>
							</div>
							<div class="section-list">
								<div class="list-left">
									<div class="list-left-tips10">
										<img src="Order-font/coco-tree.svg" />
									</div>
								</div>
								<div class="list-right">
									<p>旅游订单</p>
								</div>
							</div>
							<div class="list-hr">
								<div></div>
								<div class="hr-right">
									<hr color="#f1f3f2" />
								</div>
							</div>
						</div>
					</div>
				</section>
				<!--中间列表end -->

				<!--提示start-->
				<section class="tips-up">
					<div class="tips-down">
						<a href="javascript:divshow()" id="btnhref">查看更多</a>
					</div>
				</section>
				<!--提示end-->

				<!--底部图片内容start -->
				<section class="footer-tips">
					<div class="footer-imges">
						<!--<img src="images/holiday.jpeg"/>-->
					</div>
				</section>

				<section class="nothing">
					<div class="">
					</div>
				</section>
				<!--底部图片内容end -->
			</section>
			<!--底部导航内容start -->
			<footer>
				<!--底部导航栏填充位置-->
			</footer>
			<!--底部导航内容end -->

		</div>
	</body>

</html>